Глава 4.
Организация текста внутри документа
HTML
позволяет определять внешний вид
целых абзацев текста. Абзацы можно
организовывать в списки, выводить их
на экран в отформатированном виде, или
увеличивать левое поле. Разберем все
по порядку.
Ненумерованные
списки: <UL> ... </UL>
Текст,
расположенный между метками <UL>
и </UL>, воспринимается как
ненумерованный список. Каждый новый
элемент списка следует начинать с
метки <LI>. Например, чтобы
создать вот такой список:
- Иван;
- Данила;
- белая кобыла
необходим
вот такой HTML-текст:
<UL>
<LI>Иван;
<LI>Данила;
<LI>белая кобыла
</UL>
Обратите
внимание: у метки <LI> нет
парной закрывающей метки.
Нумерованные
списки: <OL> ... </OL>
Нумерованные списки устроены точно
так же, как ненумерованные, только
вместо символов, выделяющих новый
элемент, используются цифры. Если
слегка модифицировать наш предыдущий
пример:
<OL>
<LI>Иван;
<LI>Данила;
<LI>белая кобыла
</OL>
получится
вот такой список:
- Иван;
- Данила;
- белая кобыла
Списки
определений: <DL> ... </DL>
Список
определений несколько отличается от
других видов списков. Вместо меток <LI>
в списках определений используются
метки <DT> (от английского definition
term — определяемый термин) и <DD>
(от английского definition definition —
определение определения). Разберем
это на примере. Допустим, у нас имеется
следующий фрагмент HTML-текста:
<DL>
<DT>HTML
<DD>Термин HTML (HyperText Markup Language) означает
'язык маркировки гипертекстов'. Первую версию HTML
разработал сотрудник Европейской лаборатории физики
элементарных частиц Тим Бернерс-Ли.
<DT>HTML-документ
<DD>Текстовый файл с расширением *.html
(Unix-системы могут содержать файлы
с расширением *.htmll).
</DL>
Этот
фрагмент будет выведен на экран
следующим образом:
- HTML
- Термин HTML (HyperText
Markup Language) означает 'язык маркировки
гипертекстов'. Первую версию HTML
разработал сотрудник Европейской
лаборатории физики элементарных
частиц Тим Бернерс-Ли.
- HTML-документ
- Текстовый файл с
расширением *.html (Unix-системы могут
содержать файлы с расширением *.htmll).
Обратите
внимание: точно так же, как метки <LI>,
метки <DT> и <DD> не имеют
парных закрывающих меток.
Если
определяемые термины достаточно
коротки, можно использовать
модифицированную открывающую метку <DL
COMPACT>. Например, вот такой фрагмент
HTML-текста:
<DL COMPACT>
<DT>А
<DD>Первая буква алфавита
<DT>Б
<DD>Вторая буква алфавита
<DT>В
<DD>Третья буква алфавита
</DL>
будет
выведен на экран примерно так:
- А
- Первая буква
алфавита
- Б
- Вторая буква
алфавита
- В
- Третья буква
алфавита
Вложенные
списки
Элемент
любого списка может содержать в себе
целый список любого вида. Число
уровней вложенности в принципе не
ограничено, однако злоупотреблять
вложенными списками все же не следует.
Вложенные списки очень удобны при
подготовке разного рода планов и
оглавлений.
Наши знания
о списках можно вкратце свести в
пример 6:
<html>
<head>
<title>Пример 6</title>
</head>
<body>
<H1>HTML поддерживает несколько видов списков </H1>
<DL>
<DT>Ненумерованные списки
<DD>Элементы ненумерованного списка выделяются
специальным
символом и отступом слева:
<UL>
<LI>Элемент 1
<LI>Элемент 2
<LI>Элемент 3
</UL>
<DT>Нумерованные списки
<DD>Элементы нумерованного списка выделяются
отступом слева, а
также нумерацией:
<OL>
<LI>Элемент 1
<LI>Элемент 2
<LI>Элемент 3
</OL>
<DT>Списки определений
<DD>Этот вид списков чуть сложнее, чем два предыдущих,
но и выглядит более эффектно.
<P>Помните, что списки можно встраивать один в другой,
но не
следует закладывать слишком много уровней вложенности.
</P>
<P>Обратите внимание, что внутри элемента списка
может находиться
несколько абзацев. Все абзацы при этом будут иметь
одинаковое левое поле. </P>
</DL>
</body>
</html>
Форматированный
текст: <PRE> ... </PRE>
В
самом начале мы говорили о том, что
браузеры игнорируют множественные
пробелы и символы конца строки. Из
этого правила, однако, есть исключение.
Текст,
заключенный между метками <PRE>
и </PRE> (от английского preformatted —
предварительно форматированный),
выводится браузером на экран как есть
— со всеми пробелами, символами
табуляции и конца строки. Это очень
удобно при создании простых таблиц.
Текст с отступом: <BLOCKQUOTE>
... </BLOCKQUOTE>
Текст,
заключенный между метками <BLOCKQUOTE>
и </BLOCKQUOTE>, выводится браузером
на экран с увеличенным левым полем.